<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>配置: columns | d2-crud-plus</title>
    <meta name="generator" content="VuePress 1.7.1">
    <link rel="icon" href="/d2-crud-plus/icon-only.png">
    <link rel="manifest" href="/d2-crud-plus/manifest.json">
    <link rel="apple-touch-icon" href="/d2-crud-plus/icons/apple-touch-icon-152x152.png">
    <link rel="mask-icon" href="/d2-crud-plus/icons/safari-pinned-tab.svg" color="#3eaf7c">
    <meta name="description" content="d2-crud-plus doc">
    <meta name="theme-color" content="#3eaf7c">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="msapplication-TileImage" content="/icons/msapplication-icon-144x144.png">
    <meta name="msapplication-TileColor" content="#000000">
    
    <link rel="preload" href="/d2-crud-plus/assets/css/0.styles.04fdeb33.css" as="style"><link rel="preload" href="/d2-crud-plus/assets/js/app.bf1c5535.js" as="script"><link rel="preload" href="/d2-crud-plus/assets/js/2.40e3d83c.js" as="script"><link rel="preload" href="/d2-crud-plus/assets/js/7.20165752.js" as="script"><link rel="preload" href="/d2-crud-plus/assets/js/16.5d6e93a9.js" as="script"><link rel="prefetch" href="/d2-crud-plus/assets/js/10.77fc248c.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/100.f4941c65.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/101.cc31e991.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/11.0f16c148.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/12.bb83b150.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/13.beccd8a2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/14.a22b7450.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/15.5f81660f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/17.320c2a84.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/18.958c6cbe.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/19.491694d3.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/20.9cee9ffa.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/21.f3009eca.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/22.a733ee4a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/23.38c6ac4c.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/24.d73633ab.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/25.f426c022.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/26.87a6d1c2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/27.7ffcde1a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/28.fb2746bf.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/29.d5deb6f1.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/3.4d8b977d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/30.25258c31.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/31.d4d719da.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/32.f6c7469e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/33.da9a70b4.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/34.d9c460d3.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/35.7073fbf9.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/36.be84aac5.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/37.2f88220a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/38.6be0688f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/39.ca6b7e5f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/4.d76b877a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/40.449709b0.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/41.8ab998f2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/42.09dbe6be.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/43.b8c37edd.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/44.a46b43fa.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/45.22d50745.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/46.fa037fc6.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/47.4c86a170.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/48.9e1e3d12.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/49.2f1d3b4c.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/5.0c166f17.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/50.d306ebab.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/51.8ec7b41b.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/52.4d305a5d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/53.6fea6813.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/54.59ffd1bb.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/55.69a3e2f4.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/56.556a5d34.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/57.39b9a334.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/58.cd2ccde3.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/59.dca7ffde.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/6.60213db2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/60.786005b2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/61.b3378214.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/62.60adba12.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/63.1541b96e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/64.3405f599.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/65.829d7609.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/66.dfc7e4ed.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/67.1f81d15a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/68.3417a4ff.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/69.0b784ac5.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/70.728e2530.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/71.9231a13f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/72.38dafb88.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/73.555dcf77.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/74.f3d562bb.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/75.d302df14.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/76.799a8e93.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/77.c69c952a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/78.17b73bb0.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/79.e80a1cb1.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/8.97991d56.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/80.b1422e90.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/81.59ec6dec.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/82.ffa42064.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/83.4afcc4b2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/84.a5e2c7b2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/85.3ebfe51e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/86.d6c54dd5.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/87.3e745041.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/88.85a3355a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/89.53843766.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/9.05d1b3b4.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/90.f2700a98.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/91.8bf2de5b.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/92.133f35f3.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/93.9b1460d0.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/94.80ddb58a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/95.574b3586.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/96.678d7ce5.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/97.043fe80e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/98.785459c7.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/99.bcd84a64.js">
    <link rel="stylesheet" href="/d2-crud-plus/assets/css/0.styles.04fdeb33.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/d2-crud-plus/" class="home-link router-link-active"><!----> <span class="site-name">d2-crud-plus</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/d2-crud-plus/guide/" class="nav-link">
  指南
</a></div><div class="nav-item"><div class="dropdown-wrapper"><button type="button" aria-label="更多" class="dropdown-title"><span class="title">更多</span> <span class="arrow down"></span></button> <button type="button" aria-label="更多" class="mobile-dropdown-title"><span class="title">更多</span> <span class="arrow right"></span></button> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><h4>
          核心
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/d2-crud-plus/d2-crud-x/" class="nav-link router-link-active">
  D2-CRUD-X
</a></li></ul></li><li class="dropdown-item"><h4>
          周边项目
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus" target="_blank" rel="noopener noreferrer" class="nav-link external">
  Gitee镜像
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://github.com/greper/d2-crud-plus-with-d2admin-starter" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus-with-d2admin-starter" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目[gitee]
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://github.com/greper/d2-crud-plus-with-d2admin-starter/tree/permission" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目-带权限
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus-with-d2admin-starter/tree/permission" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目-带权限[gitee]
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://github.com/greper/d2-crud-plus-server" target="_blank" rel="noopener noreferrer" class="nav-link external">
  配套java后端
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus-server" target="_blank" rel="noopener noreferrer" class="nav-link external">
  配套java后端[gitee]
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul></li><li class="dropdown-item"><h4>
          附加
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/d2-crud-plus/guide/permission.html" class="nav-link">
  权限管理
</a></li><li class="dropdown-subitem"><a href="/d2-crud-plus/guide/generate.html" class="nav-link">
  代码生成
</a></li></ul></li><li class="dropdown-item"><h4>
          衍生项目
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="https://cloud.battcn.com/#/index" target="_blank" rel="noopener noreferrer" class="nav-link external">
  后台获取配置的CRUD
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul></li><li class="dropdown-item"><h4>
          友情链接
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="https://gitee.com/docmirror/dev-sidecar" target="_blank" rel="noopener noreferrer" class="nav-link external">
  Github加速工具
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul></li></ul></div></div><div class="nav-item"><a href="http://preview.d2-crud-plus.docmirror.cn/D2CrudPlusExample/index.html" target="_blank" rel="noopener noreferrer" class="nav-link external">
  演示
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/greper/d2-crud-plus" target="_blank" rel="noopener noreferrer" class="repo-link">
    GitHub
    <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/d2-crud-plus/guide/" class="nav-link">
  指南
</a></div><div class="nav-item"><div class="dropdown-wrapper"><button type="button" aria-label="更多" class="dropdown-title"><span class="title">更多</span> <span class="arrow down"></span></button> <button type="button" aria-label="更多" class="mobile-dropdown-title"><span class="title">更多</span> <span class="arrow right"></span></button> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><h4>
          核心
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/d2-crud-plus/d2-crud-x/" class="nav-link router-link-active">
  D2-CRUD-X
</a></li></ul></li><li class="dropdown-item"><h4>
          周边项目
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus" target="_blank" rel="noopener noreferrer" class="nav-link external">
  Gitee镜像
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://github.com/greper/d2-crud-plus-with-d2admin-starter" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus-with-d2admin-starter" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目[gitee]
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://github.com/greper/d2-crud-plus-with-d2admin-starter/tree/permission" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目-带权限
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus-with-d2admin-starter/tree/permission" target="_blank" rel="noopener noreferrer" class="nav-link external">
  精简启动项目-带权限[gitee]
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://github.com/greper/d2-crud-plus-server" target="_blank" rel="noopener noreferrer" class="nav-link external">
  配套java后端
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li><li class="dropdown-subitem"><a href="https://gitee.com/greper/d2-crud-plus-server" target="_blank" rel="noopener noreferrer" class="nav-link external">
  配套java后端[gitee]
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul></li><li class="dropdown-item"><h4>
          附加
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/d2-crud-plus/guide/permission.html" class="nav-link">
  权限管理
</a></li><li class="dropdown-subitem"><a href="/d2-crud-plus/guide/generate.html" class="nav-link">
  代码生成
</a></li></ul></li><li class="dropdown-item"><h4>
          衍生项目
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="https://cloud.battcn.com/#/index" target="_blank" rel="noopener noreferrer" class="nav-link external">
  后台获取配置的CRUD
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul></li><li class="dropdown-item"><h4>
          友情链接
        </h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="https://gitee.com/docmirror/dev-sidecar" target="_blank" rel="noopener noreferrer" class="nav-link external">
  Github加速工具
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul></li></ul></div></div><div class="nav-item"><a href="http://preview.d2-crud-plus.docmirror.cn/D2CrudPlusExample/index.html" target="_blank" rel="noopener noreferrer" class="nav-link external">
  演示
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/greper/d2-crud-plus" target="_blank" rel="noopener noreferrer" class="repo-link">
    GitHub
    <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div style="padding:20px 30px  0px 30px;"><a target="_blank" href="https://www.aliyun.com/minisite/goods?userCode=qya11txb" style="width:100%"><img src="https://img.alicdn.com/tfs/TB1qnR3R1L2gK0jSZFmXXc7iXXa-440-240.jpg" style="width:100%"></a></div> <ul class="sidebar-links"><li><a href="/d2-crud-plus/d2-crud-x/" aria-current="page" class="sidebar-link">起步</a></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading open"><span>配置项</span> <span class="arrow down"></span></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/d2-crud-x/crud.html" class="sidebar-link">总览</a></li><li><a href="/d2-crud-plus/d2-crud-x/columns.html" aria-current="page" class="active sidebar-link">配置: columns</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#title" class="sidebar-link">title</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#key" class="sidebar-link">key</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#width" class="sidebar-link">width</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#minwidth" class="sidebar-link">minWidth</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#fixed" class="sidebar-link">fixed</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#renderheader" class="sidebar-link">renderHeader</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#sortable" class="sidebar-link">sortable</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#sortmethod" class="sidebar-link">sortMethod</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#sortby" class="sidebar-link">sortBy</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#sortorders" class="sidebar-link">sortOrders</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#resizable" class="sidebar-link">resizable</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#formatter" class="sidebar-link">formatter</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#showoverflowtooltip" class="sidebar-link">showOverflowTooltip</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#align" class="sidebar-link">align</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#headeralign" class="sidebar-link">headerAlign</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#classname" class="sidebar-link">className</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#labelclassname" class="sidebar-link">labelClassName</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#filters" class="sidebar-link">filters</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#filterplacement" class="sidebar-link">filterPlacement</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#filtermultiple" class="sidebar-link">filterMultiple</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#filtermethod" class="sidebar-link">filterMethod</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#filteredvalue" class="sidebar-link">filteredValue</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#component-name" class="sidebar-link">component.name</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/d2-crud-x/columns.html#component-valuebinding" class="sidebar-link">component.valueBinding</a></li></ul></li><li><a href="/d2-crud-plus/d2-crud-x/options.html" class="sidebar-link">配置: options</a></li><li><a href="/d2-crud-plus/d2-crud-x/loading-options.html" class="sidebar-link">配置: loading-options</a></li><li><a href="/d2-crud-plus/d2-crud-x/index-row.html" class="sidebar-link">配置: index-row</a></li><li><a href="/d2-crud-plus/d2-crud-x/selection-row.html" class="sidebar-link">配置: selection-row</a></li><li><a href="/d2-crud-plus/d2-crud-x/expand-row.html" class="sidebar-link">配置: expand-row</a></li><li><a href="/d2-crud-plus/d2-crud-x/row-handle.html" class="sidebar-link">配置: row-handle</a></li><li><a href="/d2-crud-plus/d2-crud-x/form-options.html" class="sidebar-link">配置: form-options</a></li><li><a href="/d2-crud-plus/d2-crud-x/form-template.html" class="sidebar-link">配置: add|edit|view-template</a></li><li><a href="/d2-crud-plus/d2-crud-x/component.html" class="sidebar-link">配置: component</a></li><li><a href="/d2-crud-plus/d2-crud-x/pagination.html" class="sidebar-link">配置: pagination</a></li></ul></section></li><li><a href="/d2-crud-plus/d2-crud-x/events.html" class="sidebar-link">事件</a></li><li><a href="/d2-crud-plus/d2-crud-x/slots.html" class="sidebar-link">插槽</a></li><li><a href="/d2-crud-plus/d2-crud-x/expose.html" class="sidebar-link">暴露的方法</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="配置-columns"><a href="#配置-columns" class="header-anchor">#</a> 配置: columns</h1> <h2 id="title"><a href="#title" class="header-anchor">#</a> title</h2> <ul><li>说明: 表格列名</li> <li>类型: String</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="key"><a href="#key" class="header-anchor">#</a> key</h2> <ul><li>说明: data 中对应列的键名</li> <li>类型: String</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="width"><a href="#width" class="header-anchor">#</a> width</h2> <ul><li>说明: 对应列的宽度</li> <li>类型: String</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="minwidth"><a href="#minwidth" class="header-anchor">#</a> minWidth</h2> <ul><li>说明: 对应列的最小宽度，与 width 的区别是 width 是固定的，minWidth 会把剩余宽度按比例分配给设置了 minWidth 的列</li> <li>类型: String</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="fixed"><a href="#fixed" class="header-anchor">#</a> fixed</h2> <ul><li>说明: 列是否固定在左侧或者右侧，true 表示固定在左侧</li> <li>类型: String / Boolean</li> <li>可选值: true / left / right</li> <li>默认值: 无</li></ul> <h2 id="renderheader"><a href="#renderheader" class="header-anchor">#</a> renderHeader</h2> <ul><li>说明: 列标题 Label 区域渲染使用的 Function</li> <li>类型: Function (h, { column, $index })</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="sortable"><a href="#sortable" class="header-anchor">#</a> sortable</h2> <ul><li>说明: 对应列是否可以排序，如果设置为 'custom'，则代表用户希望远程排序，需要监听 Table 的 sort-change 事件</li> <li>类型: Boolean / String</li> <li>可选值: true, false, 'custom'</li> <li>默认值: false</li></ul> <h2 id="sortmethod"><a href="#sortmethod" class="header-anchor">#</a> sortMethod</h2> <ul><li>说明: 对数据进行排序的时候使用的方法，仅当 sortable 设置为 true 的时候有效，需返回一个数字，和 Array.sort 表现一致</li> <li>类型: Function (a, b)</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="sortby"><a href="#sortby" class="header-anchor">#</a> sortBy</h2> <ul><li>说明: 指定数据按照哪个属性进行排序，仅当 sortable 设置为 true 且没有设置 sort-method 的时候有效。如果 sort-by 为数组，则先按照第 1 个属性排序，如果第 1 个相等，再按照第 2 个排序，以此类推</li> <li>类型: String / Array / Function (row, index)</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="sortorders"><a href="#sortorders" class="header-anchor">#</a> sortOrders</h2> <ul><li>说明: 数据在排序时所使用排序策略的轮转顺序，仅当 sortable 为 true 时有效。需传入一个数组，随着用户点击表头，该列依次按照数组中元素的顺序进行排序</li> <li>类型: array</li> <li>可选值: 数组中的元素需为以下三者之一：ascending 表示升序，descending 表示降序，null 表示还原为原始顺序</li> <li>默认值: ['ascending', 'descending', null]</li></ul> <h2 id="resizable"><a href="#resizable" class="header-anchor">#</a> resizable</h2> <ul><li>说明: 对应列是否可以通过拖动改变宽度（需要在 <code>options</code> 中设置 border 属性为 true</li> <li>类型: Boolean</li> <li>可选值: 无</li> <li>默认值: true</li></ul> <h2 id="formatter"><a href="#formatter" class="header-anchor">#</a> formatter</h2> <ul><li>说明: 用来格式化内容</li> <li>类型: Function (row, column, cellValue, index)</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="showoverflowtooltip"><a href="#showoverflowtooltip" class="header-anchor">#</a> showOverflowTooltip</h2> <ul><li>说明: 当内容过长被隐藏时显示 tooltip</li> <li>类型: Boolean</li> <li>可选值: 无</li> <li>默认值: false</li></ul> <h2 id="align"><a href="#align" class="header-anchor">#</a> align</h2> <ul><li>说明: 对齐方式</li> <li>类型: String</li> <li>可选值: left / center / right</li> <li>默认值: left</li></ul> <h2 id="headeralign"><a href="#headeralign" class="header-anchor">#</a> headerAlign</h2> <ul><li>说明: 表头对齐方式，若不设置该项，则使用表格的对齐方式</li> <li>类型: String</li> <li>可选值: left / center / right</li> <li>默认值: 无</li></ul> <h2 id="classname"><a href="#classname" class="header-anchor">#</a> className</h2> <ul><li>说明: 列的 className</li> <li>类型: String</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="labelclassname"><a href="#labelclassname" class="header-anchor">#</a> labelClassName</h2> <ul><li>说明: 当前列标题的自定义类名</li> <li>类型: String</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="filters"><a href="#filters" class="header-anchor">#</a> filters</h2> <ul><li>说明: 数据过滤的选项，数组格式，数组中的元素需要有 text 和 value 属性。</li> <li>类型: Function ({ text, value })</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="filterplacement"><a href="#filterplacement" class="header-anchor">#</a> filterPlacement</h2> <ul><li>说明: 过滤弹出框的定位</li> <li>类型: String</li> <li>可选值: top / top-start / top-end / bottom / bottom-start / bottom-end / left / left-start / left-end / right / right-start / right-end</li> <li>默认值: bottom</li></ul> <h2 id="filtermultiple"><a href="#filtermultiple" class="header-anchor">#</a> filterMultiple</h2> <ul><li>说明: 数据过滤的选项是否多选</li> <li>类型: Boolean</li> <li>可选值: 无</li> <li>默认值: true</li></ul> <h2 id="filtermethod"><a href="#filtermethod" class="header-anchor">#</a> filterMethod</h2> <ul><li>说明: 数据过滤使用的方法，如果是多选的筛选项，对每一条数据会执行多次，任意一次返回 true 就会显示。</li> <li>类型: Function (value, row, column)</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="filteredvalue"><a href="#filteredvalue" class="header-anchor">#</a> filteredValue</h2> <ul><li>说明: 选中的数据过滤项，如果需要自定义表头过滤的渲染方式，可能会需要此属性。</li> <li>类型: Array</li> <li>可选值: 无</li> <li>默认值: 无</li></ul> <h2 id="component-name"><a href="#component-name" class="header-anchor">#</a> component.name</h2> <ul><li>说明: 表格渲染的组件名，<a href="/d2-crud-plus/d2-crud-x/component.html">更多component参数</a></li> <li>类型: String</li> <li>可选值: 任何组件</li> <li>默认值: 无</li></ul> <h2 id="component-valuebinding"><a href="#component-valuebinding" class="header-anchor">#</a> component.valueBinding</h2> <ul><li>说明: value绑定属性，当component.name 配置的是一个无value属性的组件时（即非v-model组件）,会将该cell的值赋值给该组件的指定属性</li> <li>类型: String | {prop:'目标属性',handle() }</li> <li>可选值: 组件的属性名</li> <li>默认值: 无</li> <li>示例：</li></ul> <div class="language- extra-class"><pre class="language-text"><code>//下面示例可以在表格中显示图片
component:{
    name: 'el-image',
    valueBinding:'src'  //当前格子的值（row[key]）将会赋值给el-image组件的src属性
}
</code></pre></div><div class="language- extra-class"><pre class="language-text"><code>// valueBinding 支持传入一个Object，对value做一些处理
component:{
    name: 'el-image',
    valueBinding:{
        prop: 'src',  //当前格子的值（row[key]）将会赋值给el-image组件的src属性
        handle({value}){  //对value做一些处理
            return 'http://xxxx.com/'+value
        }
    }
}
</code></pre></div></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/greper/d2-crud-plus/edit/master//docs/d2-crud-x/columns.md" target="_blank" rel="noopener noreferrer">在 GitHub 上编辑此页</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">上次更新:</span> <span class="time">2020/10/31 下午2:22:54</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
      ←
      <a href="/d2-crud-plus/d2-crud-x/crud.html" class="prev">
        总览
      </a></span> <span class="next"><a href="/d2-crud-plus/d2-crud-x/options.html">
        配置: options
      </a>
      →
    </span></p></div> </main></div><div class="global-ui"></div></div>
    <script src="/d2-crud-plus/assets/js/app.bf1c5535.js" defer></script><script src="/d2-crud-plus/assets/js/2.40e3d83c.js" defer></script><script src="/d2-crud-plus/assets/js/7.20165752.js" defer></script><script src="/d2-crud-plus/assets/js/16.5d6e93a9.js" defer></script>
  </body>
</html>
